﻿
<!DOCTYPE html>
<html>
<body>

<canvas id="myCanvas" width="100" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>

var data = [], height = 100, width = 100, radious = 50;
	for(var i = 0; i < (Math.PI * 2); (i = i + (Math.PI / 10)))
	{
		/*
		data.push({
				x : (Math.cos(i) * 50) + 50,
				y : (Math.sin(i) * 50) + 50,
				x1 : (Math.cos(i * Math.PI / 20) * 50) + 50,
				y1 : (Math.sin(i * Math.PI / 20) * 50)+ 50
		});
		*/
		
		
			var c=document.getElementById("myCanvas");
			var ctx=c.getContext("2d");
			ctx.moveTo(
						(Math.cos(i) * radious) + radious,
						(Math.sin(i) * radious) + radious
					);
			ctx.lineTo(
						(Math.cos(i) * radious) + radious + 1,
						(Math.sin(i) * radious) + radious + 1
					);
			ctx.stroke();
			
			data.push({
				x: (Math.cos(i) * radious) + radious,
				y :(Math.sin(i) * radious) + radious
		});
	}

	console.log(data);
</script>

</body>
</html>
